<template lang="pug">
    -var list = {'/':'首页','/rent':'租借记录','/shop':'我的租铺','/info':'个人信息'}
    footer.borderTopOnePx
        nav
            each val, key in list
                router-link(to=key,exact)= val
                    svg.icon.navIcon(aria-hidden="true")
                        if key == '/'
                            use(xlink:href='#icon-index')
                        else
                            use(xlink:href='#icon-'+key.substring(1))

</template>
<script>
    export default {
        name: 'footer',
        mounted(){
        },
        data () {
            return {}
        }
    }
</script>

<style lang="stylus" scoped>
    @import "../../../styles/common.styl"
    .router-link-active
        color $mainColor
    footer
        background #fff
        width 100%
        position fixed
        bottom 0
        height 2rem
        z-index 999
        nav
            display flex
            width 100%
            height 2rem
            a
                background #fff
                flex 1
                text-align center
                font-size .5rem
                text-decoration none
                color $blackColor
                line-height 3rem
                .navIcon
                    display block
                    margin 0 auto
                    margin-top -2.85rem
                    font-size 1rem
</style>
